/* 水利工程监控 弹框
* @ 劳兆城 
* @ 2017-08-16*/

<template>
	<mask-model 
		ref="mask-model"
		class="waterProjectVideo-model"	
		:title="title"
		:isCancel="true"
		@cancel="cancel">
		<div ref="video" id="waterProjectVideo-video"></div>
		
		<loading v-show="showLoading"></loading>
	</mask-model>
</template>

<script>
	import { httpUrl } from 'api/config'
import { maskModelMixin, loadingMixin } from 'common/js/mixins'
import { errorNotice } from 'common/js/dom'

export default {
		mixins: [
			maskModelMixin,
			loadingMixin
		],
		data () {
			return {
				title: '',
				showLoading: false
			}
		},
		methods: {
			cancel () {
				this.$refs.video.style.visibility = ''
			WebVideoCtrl.I_Logout(this.szIP)
			for (let i = 0; i < 17; i++) {
					WebVideoCtrl.I_Stop(i)
				}
			},
			show (feature, layerNames) {
				this.$refs['mask-model'].showModel()
			if (layerNames) {
					this._getInfo(feature.get('content').info)
			} else {
					this._getInfo(feature.get('content'))
			}
			},
			_getInfo (feature) {
				this.showLoading = true
			this.title = feature.video_title
				if (feature.video_ip) {
					this.szIP = feature.video_ip
				this.szPort = feature.video_port
				this.szUsername = feature.video_username
				this.szPassword = feature.video_password
	
				setTimeout(() => {
						this.initHkVideo()
				}, 200)
				}
			},
			initHkVideo () {
				if (WebVideoCtrl.I_CheckPluginInstall() == -1) {
					var r = confirm('点击确定安装视频插件，安装后重新打开浏览器。')
				if (r === true) {
					 	window.location.href = `${httpUrl}down/WebComponents.exe`
					}
					return
				}
	
				if (this.HkVideo === undefined) {
					this.HkVideo = WebVideoCtrl.I_InitPlugin('100%', '100%', {
						szColorProperty: 'plugin-background:eeeeee; sub-background:ffffff; sub-border:d3d3d3; sub-border-select:008cee'
					})
				WebVideoCtrl.I_InitPlugin('100%', '100%')
				WebVideoCtrl.I_InsertOBJECTPlugin('waterProjectVideo-video')
				WebVideoCtrl.I_ChangeWndNum(4)
			}
	
				this.loginHkVideo()
		},
			loginHkVideo () {
				let iRet = WebVideoCtrl.I_Login(this.szIP, 1, this.szPort, this.szUsername, this.szPassword, {
					success: (xmlDoc) => {
						this.getWayHkVideo()
				},
					error: () => {
						this.showLoading = false
					errorNotice('登录视频服务器失败，')
				}
				})
		},
			getWayHkVideo () {
				function getTagNameHtml (doc, name) {
					let el = doc.getElementsByTagName(name)[0]
					if (el) {
						return el.innerHTML
				} else {
						return ''
					}
				}
	
				let ways = []
	
			// 模拟通道
			WebVideoCtrl.I_GetAnalogChannelInfo(this.szIP, {
					async: false,
					success: function (xmlDoc) {
						var oChannels = xmlDoc.getElementsByTagName('VideoInputChannel')

					for (var i = 0; i < oChannels.length; i++) {
							var id = getTagNameHtml(oChannels[i], 'id')
						var name = getTagNameHtml(oChannels[i], 'name')
	
						if (id !== '') {
								ways.push({
									id: id,
									name: name,
									bZero: false
								})
							}
						}
					},
					error: function () {
						errorNotice('获取模拟通道视频流失败，')
				}
				})
			// 数字通道
			WebVideoCtrl.I_GetDigitalChannelInfo(this.szIP, {
					async: false,
					success: function (xmlDoc) {
						var oChannels = xmlDoc.getElementsByTagName('InputProxyChannelStatus')
	
					for (var i = 0; i < oChannels.length; i++) {
							var online = getTagNameHtml(oChannels[i], 'online')
						if (online != 'false') {
								var id = getTagNameHtml(oChannels[i], 'id')
							var name = getTagNameHtml(oChannels[i], 'name')
	
							if (id !== '') {
									ways.push({
										id: id,
										name: name,
										bZero: false
									})
								}
							}
						}
					},
					error: function () {
						errorNotice('获取数字通道视频流失败，')
				}
				})
			// 零通道
			WebVideoCtrl.I_GetZeroChannelInfo(this.szIP, {
					async: false,
					success: function (xmlDoc) {
						var oChannels = xmlDoc.getElementsByTagName('ZeroVideoChannel')

					for (var i = 0; i < oChannels.length; i++) {
							var id = getTagNameHtml(oChannels[i], 'id')
						var name = getTagNameHtml(oChannels[i], 'name')
	
						if (id !== '') {
								ways.push({
									id: id,
									name: name,
									bZero: true
								})
							}
						}
					},
					error: function () {
						errorNotice('获取零通道视频流失败，')
				}
				})
	
			setTimeout(() => {
					this.startHkVideo(ways)
			}, 20)
			},
			startHkVideo (ways) {
				ways.map((item, index) => {
					let iRet = WebVideoCtrl.I_StartRealPlay(this.szIP, {
						iWndIndex: index,			// 屏幕数字
						iStreamType: '1',			// 码流类型
						iChannelID: item.id,		// 通道列表
						bZeroChannel: item.bZero	// 模拟通道 ？ 数字通道 ？ 零通道
					})
	
				if (iRet != 0) {
						errorNotice(`获取${item.name}视频流失败，`)
				}
				})
	
			this.$refs.video.style.visibility = 'visible'
			this.showLoading = false
		}
		}
	}
</script>

<style lang="scss">
	.waterProjectVideo-model {
		#waterProjectVideo-video {
			width: 100%;
			height: 100%;
			visibility: hidden;
		}
		.ivu-modal {
			width: 90% !important;
			height: 80%;
			top: 0;
			bottom: 0;
			left: 0;
			right: 0;
			margin: auto;
			position: absolute;
			.ivu-modal-content {
				height: 100%;
			}
			.ivu-modal-body {
				height: 100%;
				padding: 5px;
				position: relative;
				overflow: hidden;
				background-color: #eeeeee;
			}
		}
	}
</style>